<template>
	<view class="request-loading-view" v-if="show">
		<view class="dialog">
			<view class="title">
			</view>

			<view class="close" @click="closeDialog">
				×
			</view>

			<view class="relus">
				答题比赛规则
			</view>

			<textarea :value="gg" fixed></textarea>

			<button type="default" class="closeB" @click="closeDialog">我知道了</button>
		</view>
	</view>
</template>

<script>
	export default {
		props: ['show'],
		data() {
			return {
				gg: '规则:比赛形式分为初赛和决赛,则如下: (一)初赛:由参赛者完成答卷,参赛期间不得使用资料或者手机。以分数排名从高到低的前10组进入决赛,若第10名的组数因为分数相同有多组,则增加进入现场答题组数。...'
			};
		},
		methods: {
			closeDialog() {
				this.$emit("closeDialog");
			}
		}
	};
</script>

<style scoped lang="scss">
	.request-loading-view {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 198903060;
		background-color: rgba(0, 0, 0, 0.001);
		display: flex;
		justify-content: center;
	}

	.dialog {
		position: relative;
		margin-top: 280rpx;
		padding: 0 54rpx;
		width: 528rpx;
		height: 450rpx;
		background: #FFFFFF;
		border-radius: 40rpx;

		.title {
			margin: -80rpx auto;
			width: 165rpx;
			height: 161rpx;
			background-image: url("");
		}

		.close {
			position: absolute;
			right: 23rpx;
			margin-top: -30rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			width: 61rpx;
			height: 61rpx;
			background: #F2F2F2;
			border-radius: 50%;
			font-size: 40rpx;
			font-weight: 500;
			color: #989898;
		}


		.relus {
			margin-top: 126rpx;
			height: 31rpx;
			font-size: 32rpx;
			text-align: center;
			font-weight: 500;
			color: #333333;
		}

		textarea {
			margin-top: 44rpx;
			width: 420rpx;
			height: 167rpx;
			font-size: 24rpx;
			font-weight: 500;
			color: #989898;
		}


		.closeB {
			margin-top: 38rpx;
			width: 240rpx;
			height: 88rpx;
			background: #FF5028;
			box-shadow: 0rpx 20rpx 30rpx 0rpx rgba(255, 80, 40, 0.2);
			border-radius: 44rpx;
			font-size: 32rpx;
			font-weight: 500;
			color: #FFFFFF;
		}
	}
</style>
